"use client";

import VideoCard, { VideoCardProps } from "./VideoCard";

interface VideoGridProps {
  title?: string;
  videos: VideoCardProps[];
}

export default function VideoGrid({ title, videos }: VideoGridProps) {
  return (
    <div className="container mx-auto py-4">
      {title && (
        <div className="flex items-center justify-between mb-4">
          <h2 className="text-xl font-bold">{title}</h2>
          <a href="#" className="text-sm text-primary hover:underline">
            查看更多
          </a>
        </div>
      )}

      <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
        {videos.map((video) => (
          <VideoCard key={video.id} {...video} />
        ))}
      </div>
    </div>
  );
}
